<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<%
//is the user allowed to be here?
if(!fr.upmc.utils.SessionTracker.isUserConnected(request))
{
	fr.upmc.utils.SessionTracker.redirectToHome(response);
	return;
}
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="scripts/login/css/style.css" />
    <script src="scripts/jquery/js/jquery-1.6.2.min.js"></script>
    <script src="scripts/jquery/js/jquery-ui-1.8.16.custom.min.js"></script>
    <script src="scripts/customInput.jquery.js"></script>
    <script src="scripts/login/js/login.js"></script>
    <script src="scripts/jquery/jquery.validate.js"></script>
    <link rel="stylesheet" href="scripts/jquery/css/ui-darkness/jquery-ui-1.8.16.custom.css" />
    <link rel="stylesheet" href="scripts/customInput.css" />
<title>Add contact</title>

<script type="text/javascript">
$(document).ready(function(){
    var button = $('#logoutButton');
    var form = $('#logoutForm');
    
    button.click(function(){
    	if(confirm('Are you sure you want to logout?'))
    		form.submit();
    	else
    		return;
    });
    
    $('input:submit').button();
    $('input').customInput();
    
    $('input[type="text"]').focus(function() {
        $(this).addClass("focus");
    });
     
    $('input[type="text"]').blur(function() {
        $(this).removeClass("focus");
    });
    
    if($("#ent").attr("checked") == "checked")
    	$("#ns").removeAttr('disabled');
    else
    	$("#ns").attr('disabled', 'disabled');
    
    $("#ent").click(function(){
    	if($("#ns").attr('disabled'))
    		$("#ns").removeAttr('disabled');
    	else
    		$("#ns").attr('disabled', 'disabled');
    });
    
    $("#addContactForm").validate();
    
    $('#addContactSubmit').click(function(){
    	
    	if($("#addContactForm").valid()){
    		var q = "firstname=" + $('input#firstname').val() +
    				"&lastname="+ $('input#lastname').val() +
    				"&email="+ $('input#email').val() +
    				"&street="+ $('input#street').val() +
    				"&city="+ $('input#city').val() +
    				"&zip="+ $('input#zip').val() +
    				"&country="+ $('input#country').val() +
    				"&pn1="+ $('input#pn1').val() +
    				"&pn2="+ $('input#pn2').val() +
    				"&pn3="+ $('input#pn3').val() +
    				"&ns="+ $('input#ns').val() +
    				"&cg="+ $('input#cg').val();
    		
    		if($("#ent").attr("checked") == "checked")
    			q += "&ent=ok";
    		
    		$("#dialog-modal").html('<p><img src="scripts/ajax-loader.gif"/></p>');
    		setTimeout(function(){$.ajax({  
    			  type: "POST",  
    			  url: "addContact.do",  
    			  data: q,  
    			  success: function(data) {
    				  if(data == "success"){
	    				  $( "#dialog-modal" ).text("Contact added with success, redirecting in 2 seconds..");
	    				  setTimeout(function(){
	    					  window.location="accueil.jsp";
	    					}, 3000);
    				  }
    				  else{
    					  	$( "#dialog-modal" ).fadeIn('slow');
    				  		$( "#dialog-modal" ).html("<h3>An error accured, please submit your data again</h3>");
    				  }
    			  }
    			})}, 1000);
    		
    		$("#dialog-modal").dialog({
    			height: 140,
    			modal: true
    		});
    			
    	}
    	
    	return false;  
    });
    
});
</script>
</head>
<body>
<div id="bar">
        <div id="container">
            <!-- Login Starts Here -->
            <div id="title">MDOC Project - Add Contact</div>
            <div id="loginContainer">
            	<a href="accueil.jsp" id="home">Home</a>
                <a href="#" id="logoutButton"><span>Log out</span></a>
                <div style="clear:both"></div>
                <div id="loginBox">                
                    <form id="logoutForm" action="authentification.do" method="post">
                        <fieldset id="body">
                            <input type="hidden" name="action" value="logout" >
                            <input type="submit" id="logout" value="Sign out" />
                        </fieldset>
                    </form>
                </div>
            </div>
            <!-- Login Ends Here -->
		</div>
	</div>
	
<div class="container">
	<br/>
	<form id="addContactForm" action="addContact.do" method="post">
		<fieldset>
			<legend>Basic information</legend>
			First name&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="firstname" id="firstname" size="30" class="required" minlength="2" /><em>*</em><br/>
			Last name&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="lastname" id="lastname" size="30" class="required" minlength="2"/><em>*</em><br/>
			Email&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="email" id="email" size="30" class="required email"/><em>*</em>
		</fieldset>
		<br/>
		<fieldset>
			<legend>Address</legend>
			Street&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="street" id="street" size ="30" class="required" minlength="10"/><em>*</em><br/>
			City&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="city" id="city" size="30" class="required" minlength="2"/><em>*</em><br/>
			Zip&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="zip" id="zip" size="10"  class="required zipcode" minlength="5"/><em>*</em><br/>
			Country&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="country" id="country" size="30" class="required" minlength="2"/><em>*</em>
		</fieldset>
		<br/>
		<fieldset>
			<legend>Phone</legend>
			Mobile&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="pn1" id="pn1" size ="30"  class="required phone" minlength="5" id="cmobile"/><em>*</em><br/>
			Home&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="pn2" id="pn2" size="30"/><br/>
			Work&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="pn3" id="pn3" size="30" />
		</fieldset>
		<br/>
		<fieldset>
			<legend>Contact groups</legend>
			Groups&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="cg" id="cg" size ="30" class="required" minlength="1"/><em>*</em>
			<i>Separate groups with comma ","</i>
		</fieldset>
		<br/>
		<fieldset>
			<legend>Is entreprise</legend>
			<input type="checkbox" id="ent" name="ent" value="entreprise">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<labe for="ent"> Is entreprise?</labe><br/>
			Num Siret&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <input type="text" name="ns" id="ns" size ="30" class="required numeric" minlength="5"/><em>*</em>
		</fieldset>
		<br/>
		<input type="submit" id="addContactSubmit" name="Validate" />
	</form>
	
	<div id="dialog-modal" title="Adding new contact ..">
		<p></p>
	</div>
</div>
</body>
</html>